<template>
    <el-form ref="formRef" :model="formData" label-width="150px" v-loading="loading">
        <el-form-item label="通知内容：" prop="content">
            <div class="w-[400px]">
                <el-input v-model="formData.content" placeholder="请输入通知内容" type="textarea"
                    :autosize="{ minRows: 6, maxRows: 4 }" show-word-limit clearable></el-input>
            </div>
        </el-form-item>
        <el-form-item label="状态：">
            <el-radio-group v-model="formData.status">
                <el-radio :label="1">开启</el-radio>
                <el-radio :label="2">关闭</el-radio>
            </el-radio-group>
        </el-form-item>
    </el-form>
    <footerSubmit>
		<el-button v-auth="'setting/notice/edit'" type="primary" @click="handleSubmit">保存</el-button>
        <el-button @click="$router.back()">返回</el-button>
	</footerSubmit>
</template>

<script lang="ts" setup name="messageMailForm">
import { ref, reactive, onMounted } from 'vue';
import { useRoute } from 'vue-router';
import { noticeDetail, noticeEdit } from '/@/api/setting/notice';
import { messageSuccess } from '/@/utils/message';

const formRef = ref(null);

const loading = ref(true);

const route = useRoute();

const identify = 'mail';

// 表单数据
const formData = reactive({
	id: 0,
    identify: identify,
    name: '',
    content: '',
    status: 1,
});

// 获取数据
const getData = async () => {
    const data = await noticeDetail({ identify: identify, id: route.query.id });

	formData.id = Number(route.query.id)
    for (const key in formData) {
        if (data[key] != null && data[key] != undefined) {
            formData[key] = data[key];
        }
    }
    loading.value = false;
};

// 保存提交
const handleSubmit = async () => {
    await noticeEdit(formData);
    messageSuccess('设置成功');
    getData();
};

onMounted(() => {
    getData();
});
</script>
